diff options
Diffstat (limited to 'src/routes/projects/[projectId]/routine/[routineId]/+page.svelte')
| -rw-r--r-- | src/routes/projects/[projectId]/routine/[routineId]/+page.svelte | 55 |
1 files changed, 51 insertions, 4 deletions
diff --git a/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte b/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte index e593ad1..74880cb 100644 --- a/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte +++ b/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte @@ -103,7 +103,7 @@ class="form-input desc" name="description" bind:value={description} - rows={3} + rows={6} placeholder="Pourquoi, comment, quand..." autocomplete="off" ></textarea> @@ -112,13 +112,15 @@ <p class="error">Intervalle invalide — ex : 1d, 2w, 3m, 1y</p> {/if} <button - class="btn-primary" + class="btn-primary btn-save" type="submit" disabled={!name.trim() || frequencyDays === null} > - Enregistrer + <span class="btn-save-label">Enregistrer</span> + <span class="btn-save-check" class:visible={saved} aria-hidden="true" + >✓</span + > </button> - <p class="save-status" class:visible={saved}>✓ Enregistré</p> </form> {/if} @@ -188,6 +190,14 @@ {#if data.completions.length === 0} <p class="empty">Aucune réalisation pour l'instant.</p> {/if} + + {#if !data.routine.archived} + <footer class="page-footer"> + <form method="POST" action="?/archive" use:enhance> + <button class="btn-archive" type="submit">Archiver la routine</button> + </form> + </footer> + {/if} </main> <style> @@ -268,4 +278,41 @@ font-size: 0.875rem; color: var(--text-secondary); } + + .page-footer { + margin-top: 2rem; + display: flex; + justify-content: center; + } + + .btn-archive { + border: none; + background: transparent; + color: var(--text-secondary); + font-size: 0.875rem; + text-decoration: underline; + cursor: pointer; + } + + .btn-archive:hover { + color: var(--danger); + } + + .btn-save { + position: relative; + padding-right: 2.75rem; + } + + .btn-save-check { + position: absolute; + right: 1rem; + top: 50%; + transform: translateY(-50%); + opacity: 0; + transition: opacity 0.2s ease; + } + + .btn-save-check.visible { + opacity: 1; + } </style> |